<template>
  <div id="app">
    <el-container style="height: 500px; border: 1px solid #eee">
      <el-aside width="200px"
                style="background-color: rgb(238, 241, 246)">
        <el-menu :default-openeds="['1', '5']">
          <el-menu-item @click="index()">首页</el-menu-item>

          <el-menu-item @click="housing()">查看所有住房</el-menu-item>
          <el-menu-item @click="Inquire()">交费</el-menu-item>
          <!-- <el-menu-item>交电费</el-menu-item> -->
          <!-- <el-menu-item @click="tologin()">用户登录</el-menu-item>
          <el-menu-item>退出登录</el-menu-item> -->
           <el-menu-item v-if="this.$store.state.static=='1'" @click="HousingSystem()">住房后台</el-menu-item>
          <div v-if="
              this.$cookies.get('status') == 'unlogin' ||
              !this.$cookies.get('status')
            ">
            <el-button class="myButton el-icon-user"
                       @click="toLogin()"
                       circle></el-button>{{this.$store.state.username}}
          </div>

          <div v-if="this.$cookies.get('status') == 'logined'">
            <el-dropdown>
              <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></el-avatar>{{this.$store.state.username}}
              <el-dropdown-menu slot="dropdown">
                <!-- <el-dropdown-item icon="el-icon-setting"><label @click="setting()">个人中心</label></el-dropdown-item> -->
                <el-dropdown-item icon="el-icon-circle-close"><label @click="exit()">退出登录</label></el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
          <!-- <el-menu-item>退出登录</el-menu-item> -->
        </el-menu>
      </el-aside>
      <router-view />
    </el-container>
  </div>
</template>
<script>
import axios from 'axios'
import myapi from '../api.js'
export default {
  data() {
    return {
      // username:"未登录"
      
    }
  },
  methods: {
   HousingSystem(){
       this.$router.push({
        path: '/HousingSystem',
      })
   },
    tologin() {
      // console.log(this.$cookies.get)
      this.$router.push({
        path: '/login',
      })
    },
    housing() {
      this.$router.push({
        path: '/housing',
      })
    },
    index() {
      this.$router.push({
        path: '/index',
      })
    },
    Inquire() {
      this.$router.push({
        path: '/inquire',
      })
    },
      toLogin() {
      this.$router.push({
        path: "/login",
      });
    },
     toHome() {
      this.$router.push({
        path: "/",
      });
    },
    exit() {
      	axios.post(myapi.logout.url)
        .then(res=>{
             this.$cookies.set("status", "unlogin");
                 location.reload();
          if(res.data.code===200)
          {
               	this.$message({
									showClose: true,
									message: '注销成功',
									type: 'success',
									center: true
								});

          }
        })
        .catch(res=>{
          	this.$message({
									showClose: true,
									message: '注销失败',
									type: 'success',
									center: true
								});
        })
     
    },
  },
}
</script>

<style>
nav {
  padding: 30px;
}

nav a {
  font-weight: bold;
  color: #2c3e50;
}

nav a.router-link-exact-active {
  color: #42b983;
}
</style>
